<template>
	<view class="content" @click.stop="click"
	style="display: flex;flex-direction: row;background-color: #FFF;align-items: center;margin-top: 2rpx;padding: 16rpx 0;position: relative">
		<image :src="row.coverUrl" mode='aspectFill' style="width: 130rpx;height: 130rpx;margin-left: 16rpx;"></image>
		<view class="center" style="width: 500rpx;">
			<view style="margin-left: 30rpx;">{{row.name}}</view>
			<view style="margin-left: 30rpx;display: flex;flex-direction: row;margin-top: 12rpx;align-items: flex-start;">
				<u-icon name="map" color='#666' size='36rpx'></u-icon>
				<text style="margin-left: 8rpx;">{{row.addr}}</text>
			</view>
		</view>
		<view class="right" style="position: absolute;right: 22rpx;">
			<view @click.stop="callAction" style="width: 62rpx;height: 62rpx;border-radius: 33rpx;border: 4rpx solid #DD4949;display: flex;flex-direction: row;align-items: center;justify-content: center;">
				<u-icon name="phone" color='#DD4949' size='22'></u-icon>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		components: {},
		props:{
			row: {
				type: Object,
				default: ()=>{}
			},
		},
		data() {
			return {
			}
		},
		onLoad() {
		},
		methods:{
			click(){
				this.$emit('click', this.row)
			},
			callAction(){
				this.$emit('callAction', this.row)
			},
		}
	}
</script>

<style scoped lang="scss">
</style>